<!--
 * @Author: chenyi
 * @Date: 2020-04-27 10:41
 * @LastEditors: wjk
 * @LastEditTime: 2021-02-06 11:09:27
 * @description: file content
 -->
<template>
  <view>
    <view class="orderList">
      <view v-for="(item, index) in orderList" :key="index" class="listItem">
        <view class="orderNo">
          <view class="stateBox">
            <!--<view class="leftIcon"></view>-->
            <text class="o-span" :class="{'red': item.status === 1}">
              {{ _getOrderState(item.status, item) }}
            </text>
          </view>
          <view v-if="item.status === 1" class="expiry">
            <view>
              <text>剩</text>
              <count-down :id-name="index" color="#E21536" splitor-color="#E21536" padding="0" margin="0" :second="item.pay_expiry" :show-day="false" :show-hour="false" @timeup="callBack" />
              <text>自动取消订单</text>
            </view>
          </view>
          <!-- <view v-else-if="item.status === 11" class="expiry">
            <view v-if="item.diff_people_num" class="o-span">还差 <text class="o-text">{{ item.diff_people_num }}</text>人就拼团成功了</view>
          </view> -->
          <view v-else class="expiry">
            <view class="normal-span">
              {{ orderStateText[_getOrderState(item.status, item)] || '' }}
            </view>
          </view>
        </view>
        <view class="goodsList" @click.prevent.stop="toOrderDetail(item)">
          <goods-item :shopping-items="item.shopping_items" :prevent-click="true"></goods-item>
        </view>
        <view class="itemFooter">
          <view>
            <view class="rowText">共计{{ item.goods_num }}件, 合计: <text class="o-a">¥{{ item.total | formatMoney }}</text> </view>
            <view class="rowButton">
              <block v-if="params.orderStatusVal != 5">
                <block v-if="item.status === 1">
                  <text class="theme o-span" @click="showPay(item)">去付款</text>
                  <text class="o-span" @click="cancalOrder(item)">取消订单</text>
                </block>
                <block v-if="item.status === 3 || item.status === 10">
                  <text class="theme o-span" @click="confirmReceipt(item)">确认收货</text>
                  <!-- <text @click="delayReceipt(item)">延长收货</text> -->
                  <!-- <text v-if="item.status === 10" class="o-span" @click="lookExpress(item)">查看物流</text> -->
                  <text class="o-span" @click="lookExpress(item)">查看物流</text>
                </block>
                <block v-if="item.electronic_invoice_status && showFaxBtn(item)">
                  <text class="theme o-span" @click="lookTax(item)">查看发票</text>
                </block>
                <block v-if="item.status === 4 && item.comment_status === 1">
                  <text class="o-span theme" @click="toEvaluation(item)">立即评价</text>
                </block>
              </block>

              <block v-if="params.orderStatusVal == 5" class="rowButton">
                <text class="theme o-span" @click="toOrderDetail(item)">查看详情</text>
              </block>

              <block v-if="item.status == 11" class="rowButton">
                <text class="theme o-span" style="padding: 0 8px; width: auto" @click.prevent.stop="setShare(item)">邀请好友拼单</text>
              </block>
              <!-- <block v-if="item.status === 7 || item.status === 5" class="rowButton relative-container">
                <text class="o-span">联系客服</text>
                <b-open-type open-type="contact" :goods="item" />
              </block> -->
            </view>
          </view>
          <block v-if="(item.status === 4 && item.comment_status === 2)">
            <view class="more-and-more">
              <view @click="showMenu(item, index)">
                更多<image mode="aspectFit" src="/static/images/icon/icon_arror_down_grep.png" />
              </view>
              <view v-if="item.showMoreMenu" class="more-menu">
                <view class="menu-item" @click="toEvaluation(item, 'edit')">我的评价</view>
              </view>
            </view>
          </block>
        </view>
      </view>
    </view>
    <pay-dialog ref="payDialog" :order-no="order_no" @submitCallBack="toPayResult"></pay-dialog>
    <confirm-popup ref="confirm" />
  </view>
</template>

<script>
import './index.scss'
import goodsItem from '../components/goodsItem'
import payDialog from '../components/payDialog'
import confirmPopup from '@/components/confirmPopup/index'
// import { navigateToMiniProgram, toMpHomePage, pageNavigateBack } from '@/utils/navigateTo'
import { getOrderStateText } from '@/utils/common'
import countDown from '@/components/count-down/index'
export default {
  components: {
    goodsItem,
    countDown,
    payDialog,
    confirmPopup,
  },
  props: {
    orderList: {
      type: Array,
      default: () => { return [] }
    },
    params: {
      type: Object,
      default: () => { return {} }
    }
  },
  data() {
    return {
      order_no: '',
      shareInfo: '',
      orderStateText: {
        '超时取消': '订单关闭',
        '待收货': '订单派送中',
        '待发货': '商家发货中',
        '订单取消': '订单关闭',
        '退款成功': '订单关闭',
        '订单已签收': '待评价',
        '已完成': '订单已签收',
        '订单成功': '已评价',
        '待分享': '等待拼单中'
      },
      navItems: [
        { label: '全部', value: 0 },
        { label: '待付款', value: 1 },
        { label: '待分享', value: 11 },
        { label: '待发货', value: 2 },
        { label: '待收货', value: 3 },
        { label: '待分享', value: 4 },
        { label: '已完成', value: 44 }
      ]
    }
  },
  computed: {
    showFaxBtn(item) {
      return function(item) {
        const arr = [2, 3, 4, 10, 11]
        return arr.includes(item.status)
      }
    }
  },
  methods: {
    // 倒计时结束的回调
    callBack(index) {
      this.orderList[index].status = 7
    },
    showMenu(item, index) {
      // this.orderList[index]['showMoreMenu'] = !this.orderList[index]['showMoreMenu']
      this.$set(item, 'showMoreMenu', !item.showMoreMenu)
      this.$forceUpdate()
    },
    // 订单状态
    _getOrderState(type, item) {
      if (this.params.orderStatusVal * 1 === 5) {
        // return getRefundStateText(type)
      } else if (item && item.comment_status === 2 && type === 4) {
        return '订单成功'
      } else if (type === 4 && item.comment_status !== 1) {
        return '已完成'
      } else {
        return getOrderStateText(type)
      }
    },
    // 查看物流
    lookExpress(item) {
      this.$navigateTo(`/pagesOrder/orderExpress/index?orderNo=${item.order_no}`)
    },
    // 查看订单详情
    toOrderDetail(item) {
      if (item.box_order_type === 1) { // 箱起申购订单
        this.$navigateTo(`/pagesBox/pick-up-detail/index?orderNo=${item.order_no}&boxType=buy`)
      } else if (item.box_order_type === 2) { // 箱起提货订单
        this.$navigateTo(`/pagesBox/pick-up-detail/index?orderNo=${item.order_no}&boxType=take`)
      } else {
        this.$navigateTo(`/pagesOrder/orderDetail/index?orderNo=${item.order_no}`)
      }
    },
    // 去付款
    showPay(item) {
      this.selectItem = item;
      this.order_no = item.order_no;
      //在线支付金额为0时使用短信弹窗验证
      if(item.channel_pay_amt==0){
        this.$emit('showCodePopup',item);
      }else{
        this.$refs.payDialog.show()
      }
    },
    toPayResult(data) {
      // #ifdef H5
      if (data.type === '2') {
        let wechatUrl = data.url
        wechatUrl += `&redirect_url=${encodeURIComponent(location.origin + '/pagesOrder/orderSuccess/index?order_no=' + this.selectItem.order_no)}`
        location.href = wechatUrl
      }
      // #endif
      // #ifdef MP-WEIXIN
      this.resetUp()
      this.$navigateTo('/pagesOrder/orderSuccess/index?orderNo=' + this.order_no)
      // #endif
    },
    // 取消订单
    cancalOrder(item) {
      this.$refs.confirm.show({
        title: '提示',
        content: '是否取消订单',
        yesCb: async() => {
          const result = await this.$api.orderApi.orderCancel({
            order_no: item.order_no
          })
          if (result.success) {
            this.$set(item, 'status', 5)
          }
        }
      })
    },
    // 确认收货
    confirmReceipt(item) {
      this.$refs.confirm.show({
        title: '提示',
        content: '是否确定收货',
        yesCb: async() => {
          const result = await this.$api.orderApi.orderConfirm({
            order_no: item.order_no
          })
          if (result.code) {
            return
          }
          uni.showToast({
            title: '确认收货',
            icon: 'none',
            duration: 2000,
            mask: true,
            success: () => {
              this.resetUp()
            }
          })
        }
      })
    },
    // 评价
    toEvaluation(item, type) {
      // this.$refs.confirm.show({
      //   title: '',
      //   content: '该功能还未开发，目前只对少量的用户开放测试，为您带来不便敬请谅解。',
      //   cancleTxt: '',
      //   contentStyle: 'padding: 60rpx 40rpx;color: #666',
      //   yesTxt: '好的'
      // })
      item.showMoreMenu = false
      this.$navigateTo(`/pagesOrder/orderEvalu/index?orderNo=${item.order_no}&type=${type}`)
    },
    setShare(item) {
      this.$emit('setShare', item)
    },
    // 查看发票
    lookTax(item) {
      this.$navigateTo('/pagesOrder/taxDetail/index?orderNo=' + item.order_no + '&orderStatus=' + item.status)
    }
  }
}
</script>
